<div class="login_body" id="changePassword">
    <div class="login_cont pub_wid">
    <h1><a href="/"><img src="/static/index/public/images/logo_b.png" /></a></h1>
    <div class="widthauto">
        <div class="login_box rg">
                <h2>重置密码</h2>
                <div class="step widthauto">
                 <span class="cur">1.验证手机号</span><em>———————</em><span>2.设置新密码</span>
                </div>
                <ul class="widthauto">
                    <li><span>手机号码</span><br />
                        <input v-model="phone" name="" type="text" placeholder="请输入手机号" class="inp"/>
                    </li>
<!--                    <li><span>图形验证码</span><br />-->
<!--                        <input name="" type="text" placeholder="请输入图形验证码" class="inp"/>-->
<!--                        <img src="/static/index/public/images/yanma.jpg" />-->
<!--                    </li>-->
                    <li><span>短信验证码</span><br />
                        <input  v-model="code" name="" type="text" placeholder="请输入短信验证码" class="inp"/>
                        <a v-if="isSendCode" @click="getMessageCode()" class="yanma">获取验证码</a>
                        <a v-if='!isSendCode' class="yanma">{{maxTime}}s</a>
                    </li>
                </ul>
                <h3><a @click="checkMember()">下一步</a></h3>
            </div>
<!--        <div class="login_box rg">-->
<!--            <h2>重置密码</h2>-->
<!--            <div class="step widthauto"> <span class="cur">1.验证手机号</span><em>———————</em><span class="cur">2.设置新密码</span> </div>-->
<!--            <ul class="widthauto">-->
<!--                <li><span>新密码</span><br />-->
<!--                    <input name="" type="text" placeholder="请输入6~20位密码" class="inp"/>-->
<!--                </li>-->
<!--                <li><span>确认新密码</span><br />-->
<!--                    <input name="" type="text" placeholder="请再次输入新密码" class="inp"/>-->
<!--                </li>-->
<!--            </ul>-->
<!--            <h3><a class="cur" href="#">完成</a></h3>-->
<!--        </div>-->
    </div>
</div>
</div>
{include file="public/account_footer"}
<script>
    var changePasswordVm = new Vue({
        el:'#changePassword',
        data:{
            maxTime:60,
            phone:'',
            code:'',
            isSendCode:true
        },
        methods:{
            getMessageCode:function () {
                var el = this;
                var postData = {
                    'phone':el.phone
                }

                AjaxPost(postData,'/index/sms/sendCodePassword').then((response)=>{
                    if(response.status == 1){
                        $.customToastr('success',response.message)
                        el.isSendCode = false
                        el.countDown()
                    }
                })
            },
            countDown:function () {
                var el = this
               var  timer = setInterval(function () {
                    if(el.maxTime == 0){
                        clearInterval(timer)
                        el.isSendCode = true
                    }else {
                        --el.maxTime
                    }
                },1000)
            },
            checkMember:function () {
                var el = this;
                var postData = {
                    'phone':el.phone,
                    'code':el.code
                }
                AjaxPost(postData,'/index/member/changePasswordCheck').then((response)=>{
                    if(response.status == 1){
                        window.location.href='/index/member/setNewPassword'
                    }
                })
            },
        },
        mounted(){

        }
    })
</script>